<div class="content-area">
  <h1>
    <clr-icon
      [attr.shape]="ms.game.darkMatterManager.darkMatter.shape"
      *ngIf="ms.game.darkMatterManager.darkMatter.shape"
      size="48"
      class="resIcon"
    ></clr-icon>
    {{ ms.game.darkMatterManager.darkMatter.name }}
    <span style="margin-left: 1rem;">
      <app-formatted-quantity
        [quantity]="ms.game.darkMatterManager.darkMatter.quantity"
        [integer]="true"
      >
      </app-formatted-quantity>
    </span>
  </h1>
  <h6>
    {{ ms.game.darkMatterManager.darkMatter.description }}
  </h6>

  <p>
    你当前声望重置的话可以得到
    <app-formatted-quantity
      [quantity]="ms.game.resourceManager.inactiveDarkMatter.quantity"
      [integer]="true"
    >
    </app-formatted-quantity>

    {{ ms.game.darkMatterManager.darkMatter.name }}
  </p>

  <clr-alert [clrAlertType]="'info'" [clrAlertClosable]="false">
    <clr-alert-item>
      <span class="alert-text">
        时间扭曲不会影响战斗和自动化人员
        <br />
        可用扭曲:
        {{
          ms.game.darkMatterManager.darkMatter.quantity.toNumber() * 1000
            | endIn
        }}
      </span></clr-alert-item
    >
  </clr-alert>

  <div class="clr-row">
    <div
      class="clr-col-12 clr-col-md-6"
      *ngFor="let act of ms.game.darkMatterManager.actions; trackBy: getActId"
    >
      <app-action [action]="act"></app-action>
    </div>
  </div>
</div>
